<div class="page-layout simple left-sidebar inner-sidebar">

    <!-- HEADER -->
    <div class="header accent p-24" fxLayout="row" fxLayoutAlign="start center">

        <button mat-icon-button class="sidebar-toggle mr-8" fxHide.gt-md
                (click)="toggleSidebar('simple-left-sidebar-3')">
            <mat-icon>menu</mat-icon>
        </button>

        <div>
            <h2>Left inner sidebar with content scroll</h2>
        </div>

    </div>
    <!-- / HEADER -->

    <!-- CONTENT -->
    <div class="content">

        <!-- SIDEBAR -->
        <fuse-sidebar class="sidebar" name="simple-left-sidebar-3" position="left" lockedOpen="gt-md">

            <!-- SIDEBAR CONTENT -->
            <div class="content p-24" fusePerfectScrollbar>
                <fuse-demo-sidebar></fuse-demo-sidebar>
            </div>
            <!-- / SIDEBAR CONTENT -->

        </fuse-sidebar>
        <!-- / SIDEBAR -->

        <!-- CENTER -->
        <div class="center p-24" fusePerfectScrollbar>

            <!-- CONTENT -->
            <div class="content p-24">
                <fuse-demo-content></fuse-demo-content>
            </div>
            <!-- / CONTENT -->

        </div>
        <!-- / CENTER -->

    </div>
    <!-- / CONTENT -->

</div>
